<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8" />
	<title>Document</title>
	<link rel="stylesheet" href="S.css" />
	<script type="text/javascript" src="../jquery.min.js"></script>
	<script type="text/javascript" src="S.js"></script>
</head>
<body>
	
	<div id="x1" style="width:500px;height:300px;border:solid 1px #ccc;position:absolute;left:100px;top:50px;overflow: scroll;" >
	</div>
	<button id="b1">expandall</button>
	<button id="b2">colspandall</button>
	<script type="text/javascript">
		var tree= new S.Tree({
			el:'#x1',
			//checkbox:'s1',
			click:function(node){
				console.log(node.data.text);
			},
			menus:{'增加':function(node){
				alert(node.data.text);
			},
			删除:function(){
				alert('remove');
			}}
		});
		/* tree.setData([{
			text:'a.txt',
			children:[{
				text:'test.txt',
				click:function(){
					console.log('asdfasdfasdfasdf');
				},
				children:[{
					text:'中文.doc',
					check:true
				},{
					text:'中文.doc'
				},{
					text:'中文.doc'
				},{
					text:'中文.doc',
					icon:'tree-icons file'
				}]
			},{
				text:'end.txt'
			},{
				text:'end.txt'
			},{
				text:'end.txt'
			}
			]
		}]); */
		
		tree.setFlatData([
		                  {id:1,text:'a.bin'},
		                  {id:2,text:'a.bin'},
		                  {id:3,text:'a.bin'},
		                  {id:10,pid:1,text:'a.bin'},
		                  { id:4,pid:2,text:'a.bin'},
		                  { id:5,pid:2,text:'a.bin'},
		                  { id:6,pid:3,text:'a.bin'},
		                  { id:7,pid:5,text:'a.bin'},
		                  { id:8,pid:3,text:'a.bin'},
		                  { id:9,pid:8,text:'a.bin'},
		                  ]);
		
		$('#b1').click(function() {
			tree.expandAll();
			
			
			
		});
		$('#b2').click(function() {
			tree.collapseAll();
		});
		
	</script>
	
</body>
</html>